{template header}

<style>

    #myProgress {
        width: 100%;
        background-color: #ddd;

        text-align: right;
    }

    #myBar {
        width: {$rate}%;
        height: 30px;
        background-color: orange;
        text-align: center;
        line-height: 30px;
        color: white;
    }
</style>

<div class="container">


<div class="row">

<div class="col-md-8">

    <div class="panel panel-default">
        <div class="panel-body">
            <section style="background-color: rgb(255, 255, 255);padding-top: 10px">
                <section class="Powered-by-XIUMI V5" style="position: static;">
                    <section style="text-align: center; margin: 30px 0% 10px; position: static;">
                        <section class="" >
                            <section class="Powered-by-XIUMI V5" style="position: static;">
                                <section class="" style="margin: -45px 0% 0px; position: static;">
                                    <section class="" style="display: inline-block; width: 25%; vertical-align: top; padding: 5px; border-top: 0px solid rgb(62, 62, 62); border-top-left-radius: 0px; background-color: rgb(255, 255, 255);">
                                        <section class="Powered-by-XIUMI V5" style="position: static;">
                                            <section class="" style="position: static;">
                                                <section class="" style="display: inline-block; vertical-align: bottom; margin: auto; width: 4em; height: 4em; border-radius: 100%; background-image: url('{$strGroup[photo]}'); background-position: center center; background-repeat: no-repeat; background-size: cover; border-width: 1px; border-color: #9db4c2;">
                                                    <section class="" style="width: 100%; height: 100%; overflow: hidden;">
                                                        <img class="" style="width: 100%; height: 100%; opacity: 0;" src="{$strGroup[photo]}" data-ratio="1" data-w="467" _width="100%"/>
                                                    </section>
                                                </section>
                                            </section>
                                        </section>
                                    </section>
                                </section>
                            </section>
                            <section class="Powered-by-XIUMI V5" style="position: static;" >
                                <section  style="position: static;">
                                    <section  style="text-align: justify; font-size: 13px;line-height: 30px">
                                        <div>
                                            <div style="text-align: center; ">
                                                <h2 >微澜图书馆『{$strGroup[groupname]}』众筹中</h2>
                                                <h1 style="font-size:18px;margin:0;padding:0;font-weight: 500">从今天起，这间图书馆有你一份</h1>
                                            </div>

                                            <div class="join" style="text-align: center;padding-top: 10px;padding-bottom: 10px;">

                                                <span><a class="btn btn-success" href="javascript:if(confirm('确实要报名馆员吗?'))location='{tsUrl('group','join',array('groupid'=>$strGroup['groupid'],'jointype'=>1,'link'=>$link))}'">报名馆员参加服务</a></span>
                                                <span><a class="btn btn-success" href="javascript:if(confirm('确实要报名馆东吗?'))location='{tsUrl('group','join',array('groupid'=>$strGroup['groupid'],'jointype'=>3,'link'=>$link))}'">报名月捐成为馆东</a></span>

                                            </div>
                                       </div>

                                                <div>

<section  style="width:98%;
border:none;
border-style:none;
margin:0.5rem auto;" id="shifu_qmi_006" donone="shifuMouseDownPayStyle(&#39;shifu_qmi_006&#39;)">
                                                    <section style="width:1.25rem;
height:2px;
background-color:rgb(130, 195, 26);
border-radius:0.625rem;
color:rgb(130, 195, 26);" class="ipaiban-bg"></section>
                                                    <section style="width:2.5rem;
height:2px;
background-color:rgb(130, 195, 26);
margin-top:3px;
border-radius:0.625rem;
color:rgb(130, 195, 26);" class="ipaiban-bg"></section>
                                                    <section style="height:2px;
background-color:rgb(130, 195, 26);
margin-top:3px;
border-radius:0.625rem;
color:rgb(130, 195, 26);" class="ipaiban-bg"></section>
                                                    <section style="
font-size:1.2rem;
letter-spacing:1.5px;
padding:0.625rem; color:rgb(68, 68, 68);
line-height:1.75em;">
                                                        <p style="margin:0;">
                                                            微澜图书馆设立于城中村打工子女学校，由志愿者团队（馆东出钱、馆员出力）滋养、建设、运营，面向流动儿童稳定开放。 </p>
                                                        </p>
                                                        <p>馆东捐赠的善款将用于图书更新、借阅软件、活动开展和志愿者津贴等开支。 </p>
                                                        <p> 成为馆东，即拥有分馆理事选举权和被选举权。馆东大会选举产生分馆理事会，负责分馆日常运营，完成改善图书馆环境、组织馆员值班开馆、经费支出和公示等工作（大部分可在线上完成）。 </p>
                                                        <p> 成为馆东，意味着长期陪伴城市边缘一个小型公益图书馆的成长和发展，意味着对公益从心动成为行动。
                                                        </p>
                                                        <p style="margin:0;">
                                                            启动一所微澜图书馆，至少需要20名馆东，月捐凑足800元。
                                                        </p>

                                                    </section>
                                                    <section style="height:2px;
background-color:rgb(130, 195, 26);
border-radius:0.625rem;
color:rgb(130, 195, 26);" class="ipaiban-bg"></section>
                                                    <section style="height:2px;
text-align:right;
margin-top:3px;">
                                                        <section style="width:2.5rem;
height:2px;
background-color:rgb(130, 195, 26);
border-radius:0.625rem;
display:inline-block;
vertical-align:top;
color:rgb(130, 195, 26);" class="ipaiban-bg"></section>
                                                    </section>
                                                    <section style="height:2px;
text-align:right;
margin-top:3px;">
                                                        <section style="width:1.25rem;
height:2px;
background-color:rgb(130, 195, 26);
border-radius:0.625rem;
display:inline-block;
vertical-align:top;
color:rgb(130, 195, 26);" class="ipaiban-bg"></section>
                                                    </section>
                                                </section>
                                                    {if $strGroup['count_sto']<20}
                                                    <div style="display: flex;">
                                                        <div id="myProgress" >
                                                            <div id="myBar">已招馆东{$strGroup['count_sto']}</div>

                                                        </div>
                                                    </div>
                                                    {/if}

                                                    <div class="topic-content" style="padding-top: 15px">
                                                        <div class="topic-view">
                                                        {$strArticle['content']}
                                                            </div>

                                                    </div>

                                                    <section  style="width:98%;
border:none;
border-style:none;
margin:0.5rem auto;" id="shifu_qmi_001" donone="shifuMouseDownPayStyle(&#39;shifu_qmi_001&#39;)">
                                                        <section style="
padding:0px;">
                                                            <section style="width:100%;
text-align:center;
display:flex;
justify-content:flex-start;
margin-left:1.25rem;
margin-bottom:-0.9375rem;">
                                                                <section style="
display:inline-block;
width:auto">
                                                                    <section style="border:1px solid #4F86C6;
height:1.25rem;
margin-right:-4px;
background-color: #fff;
margin-left:4px;
border-radius:2px;" class="ipaiban-bc"></section>
                                                                    <section style="height:1.25rem;
padding:2px 0.625rem;
margin-top:-1rem;
background:#4F86C6;
line-height:1rem;
border-radius:2px;
color:#fff;
font-size:1.2rem;
letter-spacing:1px;" class="ipaiban-bg">
                                                                        <p style="margin:0;">
                                                                            本馆概况
                                                                        </p>
                                                                    </section>
                                                                </section>
                                                            </section>
                                                            <section style="border:1px solid #4F86C6;
padding:0.9375rem 1.25rem;
border-radius:5px;" class="ipaiban-bc">
                                                                <section style="
font-size:1.2rem;
letter-spacing:1.5px;
padding:0.625rem;
color:rgb(68, 68, 68);
line-height:1.75em;">
                                                                    <div >
                                                                        <style>img{width:100%;}</style>

                                                                            {$strDes['content']}

                                                                    </div>
                                                                </section>
                                                            </section>
                                                        </section>
                                                    </section>



                                                {if $strGroup['image']}
                                                    <div style="display:flex;justify-content:space-between;">
                                                <div class="piclist" >
                                                    <ul>
                                                        {loop $strGroup['image'] $k $pic}
                                                        <li style="border-bottom: none"><a href="{$pic}"><img style="width:100px;height: auto;position:absolute; clip:rect(0px 120px 70px 0px); " src="{$pic}"></a></li>
                                                        {/loop}
                                                    </ul>
                                                </div></div>
                                                {/if}

                                            </div>

                                    </section>

                                </section>

                            </section>

                        </section>

                    </section>

                </section>

            </section>


        </div>
        <div class="join" style="text-align: center;padding-top: 10px;padding-bottom: 10px;">

            <span><a class="btn btn-success" href="javascript:if(confirm('确实要报名馆员吗?'))location='{tsUrl('group','join',array('groupid'=>$strGroup['groupid'],'jointype'=>1,'link'=>$link))}'">报名馆员参加服务</a></span>
            <span><a class="btn btn-success" href="javascript:if(confirm('确实要报名馆东吗?'))location='{tsUrl('group','join',array('groupid'=>$strGroup['groupid'],'jointype'=>3,'link'=>$link))}'">报名月捐成为馆东</a></span>

        </div>

    </div>

</div>



</div>
</div>


{template footer}